<template>
    <div class="card-page">
        <tool-bar nav="" :title='action_name + "后台角色"'>
            <el-button size="small" @click="$router.push('/admin/admin-role/add')" v-if="$props.action=='edit'">新建</el-button>
            <el-button size="small" @click="save_click" type="primary"> 保存</el-button>
        </tool-bar>
        <el-row :gutter="12" type="flex">
            <el-col :span="12">
                <el-card shadow="always">
                    <template #header>
                        <span>基本信息</span>
                    </template>
                    <kv label="name">
                        <el-input v-model="info.name" chk="*"/>
                    </kv>
                    <kv label="permissionApis">
                        <api-ref v-model="info.permissionApis" multi></api-ref>
                        <!--                        <input-table style="width:100%" fields="name:名称,path:路径"-->
                        <!--                                     v-model="info.permissionApis"></input-table>-->
                    </kv>
                    <kv label="menus">
                        <menu-ref v-model="info.menus" multi/>
                    </kv>
                    <kv label="pageActions">
                        <action-ref v-model="info.pageActions" multi/>
                    </kv>
                </el-card>
            </el-col>
        </el-row>
    </div>
</template>

<script setup>
/**
 * Created by CodeGenerator  at 2021-04-13 19:37:26
 */
import apiRef from "../admin-permission-api/admin-permission-api-ref.vue"
import menuRef from "../admin-menu/admin-menu-ref.vue"
import actionRef from "../admin-permission-page-action/admin-permission-page-action-ref.vue"



//定义 vue2的this,当前组件
const $self = getCurrentInstance();

//定义 $attrs
const $attrs = useAttrs();

//定义data
const $data = reactive({
    info: {
        permissionApis: [],
        menus: [],
        pageActions: [],
    }, //子对象需要声明。
});
const info = $computed(()=> $data.info );

const $props = defineProps({
    id: { type: String },
    action: { type: String }
});
const action_name = $computed(()=>{
    return {add: "添加", edit: "修改"}[$props.action]
});


const delete_click = function (row) {
};
const loadData = function () {
    if (!$props.id) return;
    jv.$http.post("/admin/admin-role/detail/" + $props.id).then(res => {
        $data.info = res.data.data;
    });
};
const save_click = function () {
//校验
    if (jv.chk_main() == false) {
        return;
    }
    jv.$http.post("/admin/admin-role/save", $data.info).then(res => {
//[axios拦截器中已处理了异常]。
        jv.info(action_name + " 成功");
        if ($props.action == "add") {
            jv.$router.push("/admin/admin-role/edit/" + res.data.data)
        } else if (this.action == "edit") {
            jv.$router.push("/admin/admin-role/list")
        }
    })
};

onMounted(()=>{
    loadData();
})

</script>
